import {
  ProFormSelect,
  ProFormText,
  StepsForm,
} from '@ant-design/pro-components';
import '@umijs/max';
import {Modal,} from 'antd';
import React from 'react';
export type FormValueType = {
  userAccount?:number;
  userStatus?:number
  userAuthority?:number
} & Partial<API.UserListItem>;
export type UpdateFormProps = {
  onCancel: (flag?: boolean, formVars?: FormValueType) => void;
  onSubmit: (values: FormValueType) => Promise<void>;
  updateModalOpen: boolean;
  values: Partial<API.UserListItem>;
};
const userAuthorityType = [
  {
    value: 0,
    label: '普通用户',
  },
  {
    value: 1,
    label: '管理员',
  },
];
const userStatus = [
  {
    value: 0,
    label: '正常',
  },
  {
    value: 1,
    label: '封号',
  },
  {
    value: 2,
    label: '过期',
  },
];

const UpdateForm: React.FC<UpdateFormProps> = (props) => {
  return (
    <StepsForm
      stepsProps={{
        size: 'small',
      }}
      stepsFormRender={(dom, submitter) => {
        return (
          <Modal
            width={640}
            destroyOnClose
            title={'编辑用户信息'}
            open={props.updateModalOpen}
            footer={submitter}
            onCancel={() => {
              props.onCancel();
            }}
          >
            {dom}
          </Modal>
        );
      }}
      onFinish={props.onSubmit}
    >
      <StepsForm.StepForm
        initialValues={{
          userAccount: props.values.userAccount,
          userAuthority:props.values.userAuthority,
          userStatus:props.values.userStatus,
        }}
        title={'基本信息'}
      >
        <ProFormText
          name="userAccount"
          label={'用户账号'}
          width="md"
          disabled={true}
        />
        <ProFormSelect
          label="权限"
          name="userAuthority"
          options={userAuthorityType}
        />
        <ProFormSelect
          label="状态"
          name="userStatus"
          options={userStatus}
        />

      </StepsForm.StepForm>
    </StepsForm>
  );
};
export default UpdateForm;
